<template>
  <div>
    <!-- 需求:只缓存layout且layout内部访问的是home时才缓存 -->
    <keep-alive include="Layout,Result">
      <router-view v-if="$route.meta.keepAlive" />
    </keep-alive>
    <router-view v-if="!$route.meta.keepAlive" />
    <!-- 如果当前路由是home时就使用该缓存,不是home就不使用该缓存 -->
  </div>
</template>
<script>
export default {
  data () {
    return {}
  },
  created () {
    // console.log(1)
  }
}
</script>
<style lang="less" scoped>
// 设计稿是900px    450=450/90rem
// @rem: 90rem;
// .box {
//   width: (450 / @rem);
//   height: (100 / @rem);
//   background-color: #f00;
// }
// @rem: 90rem;
// .box {
//   width: 900px;
//   height: 100px;
//   background-color: #f00;
// }
// 100vw===900px
// @vw: 9vw;
// 原理需要懂：js如果修改宽高等样式也需要写转换
.box {
  width: 900px;
  height: 100px;
  background-color: #f00;
}
</style>
